<template>
  <px-scrollbar v-show="!isMain && isView" class="view-equip-detail">
    <px-button style="margin: 16px 0 24px" type="primary" icon="ArrowLeft" @click="backMainPage">返回</px-button>
    <div class="view-equip-title">点位信息</div>
    <div class="view-equip-wrap">
      <div class="view-equip-content">
        <div class="view-equip-item">
          <div class="label">点位编码</div>
          <div class="text">{{ rowData.tagCode }}</div>
        </div>
        <div class="view-equip-item">
          <div class="label">点位描述</div>
          <div class="text">{{ rowData.tagComment }}</div>
        </div>
        <div class="view-equip-item">
          <div class="label">点位单位</div>
          <div class="text">{{ rowData.tagUnit }}</div>
        </div>
      </div>
      <div class="view-equip-content">
        <div class="view-equip-item">
          <div class="label">常量点位</div>
          <div class="text">{{ rowData.isConstantDesc }}</div>
        </div>
        <div class="view-equip-item">
          <div class="label">常量值</div>
          <div class="text">{{ rowData.constantValue }}</div>
        </div>
        <div class="view-equip-item">
          <div class="label">子包</div>
          <div class="text">{{ rowData.intouchPackageName }}</div>
        </div>
      </div>
      <div class="view-equip-content">
        <div class="view-equip-item">
          <div class="label">厂区</div>
          <div class="text">{{ rowData.facCodeDesc }}</div>
        </div>
        <div class="view-equip-item">
          <div class="label">科室</div>
          <div class="text">{{ rowData.classNameDesc }}</div>
        </div>
        <div class="view-equip-item">
          <div class="label">系统</div>
          <div class="text">{{ rowData.systemCodeDesc }}</div>
        </div>
      </div>
      <div class="view-equip-content">
        <div class="view-equip-item">
          <div class="label">物理位置信息</div>
          <div class="text">{{ rowData.positionNameAll }}</div>
        </div>
        <div class="view-equip-item">
          <div class="label">数据类型</div>
          <div class="text">{{ rowData.dataType }}</div>
        </div>
        <div class="view-equip-item">
          <div class="label">表底区间</div>
          <div class="text">
            {{ rowData.tableValueMin }}
            <span v-if="typeof rowData.tableValueMin === 'number' && typeof rowData.tableValueMax === 'number'"> — </span>
            {{ rowData.tableValueMax }}
          </div>
        </div>
      </div>
      <div class="view-equip-content">
        <div class="view-equip-item">
          <div class="label">设备编码</div>
          <div class="text">{{ rowData.eqpId }}</div>
        </div>
        <div class="view-equip-item">
          <div class="label">对应设备状态</div>
          <div class="text">{{ rowData.eqpStatusDesc }}</div>
        </div>
        <div class="view-equip-item">
          <div class="label">采集类别</div>
          <div class="text">{{ rowData.collectTypeDesc }}</div>
        </div>
      </div>
    </div>
  </px-scrollbar>
</template>
<script setup lang="ts">
import { computed, getCurrentInstance, reactive, toRefs, watch } from "vue";
// 调用父级-返回主页、查询列表方法
const emits = defineEmits(["backMainPage"]);
// 父级传过来的值
const props = defineProps(["isMain", "isView", "rowData"]);
// 显示隐藏
const isMain = computed(() => props.isMain);
const isView = computed(() => props.isView);
// 页面本身的值
const { proxy }: any = getCurrentInstance();
const state = reactive<any>({
  formValue: {}
});
const { formValue } = toRefs(state);
// 监视isMain和isView值
watch(isMain, async val => {
  if (!val && props.isView) {
    formValue.value = props.rowData;
  } else {
    formValue.value = {};
  }
});

// 返回主页面
const backMainPage = () => {
  emits("backMainPage");
};
</script>
<style lang="scss" scoped>
@import url("@/views/all/equip/scss/view-detail.scss");
</style>
